import styled from 'styled-components'

export const HeaderWrapper = styled.div`
  .header {
    padding: 0;
    //position: fixed;
    //width: calc(100% - 200px);
    //z-index: 999;
    //background-color: #ffffff;

    display: flex;
    justify-content: space-between;

    .left {
      display: flex;
      align-items: center;

      .toggle-menu {
        font-size: 16px;
        width: 64px;
        height: 64px;
      }
    }

    .right {
      margin-right: 30px;
      display: flex;

      .other-info {
        display: flex;
        align-items: center;

        .color-picker {
          margin: 0 10px;
        }
      }

      .userinfo {
        display: flex;
        align-items: center;

        .headPortrait {
          width: 32px;
          height: 32px;
          margin: 3px 10px 0;
          border-radius: 50%;
        }
      }
    }
  }
`
